$('#header').load('header.html')
$('#footer').load('footer.html')

// 手机号
var phone = /^[1][3,4,5,7,8][0-9]{9}$/;
var flag1 = false
$('#phoneInput').blur(function () {
    var phoneVal = $(this).val()
    if (phone.test(phoneVal)) {
        flag1 = true;
    } else {
        $('.yz1').show()
        setTimeout(function () {
            $('.yz1').hide();
        }, 2000);
    };
})
// 滑块
var flag2 = false
onload = function () {
    function $(a) {
        return document.querySelector(a); //获取元素的函数
    }
    var oSlider = $(".slider");
    var oBg = $(".slider_bg");
    var oText = $(".labelTip");
    var oBtn = $(".label");
    var success = false; //判断验证是否成功
    var distance = oSlider.offsetWidth - oBtn.offsetWidth; //验证成功的距离
    oBtn.onmousedown = function (eve) {
        oBg.style.transition = "";
        oBtn.style.transition = "";
        var e = eve || window.event;
        var downX = e.clientX; //获取鼠标刚按下时的坐标 相对于浏览器页面
        document.onmousemove = function (eve) {
            var e = eve || window.event;
            var moveX = e.clientX; //获取鼠标移动时的坐标 相对于浏览器页面
            var offsetX = moveX - downX; //物块移动的距离
            if (offsetX > distance) {
                offsetX = distance;
            } else if (offsetX < 0) {
                offsetX = 0;
            }
            oBtn.style.left = offsetX + "px";
            oBg.style.width = offsetX + "px";
            if (offsetX == distance) { //判断验证通过
                oText.innerHTML = "验证成功";
                oBtn.innerHTML = "√";
                oText.style.color = "#FFF";
                oBtn.style.color = "rgb(39, 233, 21)";
                success = true;
                document.onmousemove = null;
                oBtn.onmousedown = null;
            }
        }
    }
    document.onmouseup = function () {
        if (success) { //如果已经验证成功了 那么结束函数
            flag2 = true;
            return;
        } else { //反之 验证没有通过 则物块原来的位置
            oBtn.style.left = 0;
            oBg.style.width = 0;
            oBg.style.transition = "width  ease";
            oBtn.style.transition = "left  ease";
        }
        document.onmousemove = null;
        oBtn.onmouseup = null;
    }
}
